<template>
 <div>
     书名：<input type="text" v-model="name"> <br>
     价格：<input type="text" v-model="price"><br>
     作者：
     <select v-model="id">
         <option value="" selected='selected'>--请选择--</option>
         <option v-for=" i in data" :value="i.id">{{i.name}}</option>
     </select>
     <br>
     <button @click="add">添加</button>

 </div>
</template>

<script>
export default {
 data() {
  return {
    data:'',
    id:'',
    name:'',
    price:'',


  }
 },
 components: {

 },
 mounted() {
     this.axios({
         url:'http://127.0.0.1:8000/book/',
         method:"get",
     }).then(res=>{
         this.data = res.data.data

     })
 },
 methods:{
     add(){
        this.axios({
        url:'http://127.0.0.1:8000/addbook/?name='+this.name+'&price='+this.price+'&id='+this.id,
        method:"get",
        }).then(res=>{
            alert(res.data.data)

        })
     }
 }

}
</script>
